<template>
  <div class="hello">
    <div>
    <h1>{{ msg }}</h1>
    <form>
      <input type="file" @change="getFile($event)">
      <button class="button button-primary button-pill button-small" @click="submit($event)">提交</button>
    </form>
    </div>
     <div>
    <img class="hello" src="../../static/img/logo.png" style="width: 500px;height: 500px">



    </div>

  </div>
</template>

<script>

  export default {
    data() {
      return {
        msg: 'Welcome to Your Vue.js App',
        file: ''

      }
    },

    methods: {

      getFile: function (event) {
        this.file = event.target.files[0];
        console.log(this.file);
      },
      submit: function (event) {
        //阻止元素发生默认的行为
        event.preventDefault();
        let formData = new FormData();
        console.log(formData)
        formData.append("file", this.file)
        axios.post('/upload/singlefile', formData)
          .then(function (response) {
            alert(response.data);
            console.log(response);
           // window.location.reload();
          })
          .catch(function (error) {
            alert("上传失败");
            console.log(error);
            //window.location.reload();
          });
      }
    }
  }
</script>
